<template>
  <j-modal
    :title="title"
    :width="700"
    :visible="visible"
    switchFullscreen
    :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }"
    @cancel="handleCancel"
    @ok="handleOk"
  >
    <a-form-model layout="horizontal" ref="realForm" :model="taskVo" :rules="validatorRules" v-bind="formItemLayout">
      <div v-if="type !== 'details'">处置</div>
      <z-form-item :datas="fieldArr1" :form="dispose" :rules="validatorRules" :gutter="0" />
      <a-checkbox v-model="ynBool" v-if="type !== 'details'"> 发起任务 </a-checkbox>
      <z-form-item :datas="fieldArr2" :form="taskVo" :rules="validatorRules" :gutter="0" v-if="ynBool">
        <template slot="slots-alarmPersons">
          <a-select
            mode="tags"
            v-model="taskVo.alarmPersons"
            :disabled="fieldArr2[1].disabled"
            :options="targetOptions"
            placeholder="请选择目标人员"
            @change="handleChange"
          />
        </template>
        <template slot="slots-modelId">
          <a-checkbox-group :options="modelOptions" v-model="taskVo.modelId">
            <span slot="label" slot-scope="{ value }" style="color: red">{{ value }}</span>
          </a-checkbox-group>
        </template>
      </z-form-item>
    </a-form-model>
  </j-modal>
</template>

<script>
import { alarmCenterDisposal, getAnagement, getQuery, taskQueryModel } from '@/api/sjsk/alarmService'
export default {
  data() {
    return {
      title: '处置',
      type: 'add',
      visible: false,
      disableSubmit: false,
      ynBool: false,
      dispose: {},
      taskVo: {},
      model: {
        dispose: {},
        taskVo: {},
        yn: 0
      },
      formItemLayout: {
        labelCol: { span: 5 },
        wrapperCol: { span: 17 },
      },
      targetOptions: [],
      modelOptions: [],
      fieldArr1: [
        { label: '告警类型', prop: 'alarmType', tagType: 'dict-select', dictOptions: [], disabled: true },
        { label: '告警程度', prop: 'alarmLevel', tagType: 'dict-select', dictCode: 'alarm_degree', disabled: true },
        { label: '告警时间', prop: 'alarmTime', tagType: 'date-picker', disabled: true },
        { label: '告警人员', prop: 'name', tagType: 'input', disabled: true },
        { label: '其他说明', prop: 'otherInstructions', tagType: 'textarea', disabled: false },
      ],
      fieldArr2: [
        { label: '任务名称', prop: 'taskName', tagType: 'input', disabled: false },
        { label: '目标对象', prop: 'alarmPersons', disabled: false },
        {
          label: '风险级别',
          prop: 'riskLevel',
          tagType: 'dict-select',
          dictCode: 'risk_level',
          type: 'radio',
          disabled: false,
        },
        { label: '选择模型', prop: 'modelId', disabled: false },
        { label: '备注', prop: 'remarks', tagType: 'textarea', disabled: false },
      ],
      validatorRules: {
        'taskName': [{ required: true, message: '请输入任务名称' }],
        'alarmPersons': [{ required: true, message: '请选择目标对象' }],
        'riskLevel': [{ required: true, message: '请选择级别' }],
        'modelId': [{ required: false, message: '请选择模型' }],
      },
    }
  },
  created() {
    this.initDictOptions()
  },
  methods: {
    show(record, type) {
      this.visible = true
      this.type = type
      let dispose = { alarmType: record.alarmType, alarmLevel: record.alarmLevel, alarmTime: record.alarmTime }
      this.dispose = Object.assign({}, dispose)
      this.taskVo = Object.assign({}, { taskName: this.$filterDictTextByCache('model_type', record.alarmType) })
      this.model = Object.assign({}, { id: record.id })
      if (this.type === 'add') {
        this.title = '处置'
        this.disableSubmit = false
        this.fieldArr1.forEach(item=> {
          if(item.prop=='otherInstructions') item.disabled = false
        })
      } else if (this.type === 'details') {
        this.title = '处置结果'
        this.disableSubmit = true
        this.fieldArr1.forEach(item=> {
          if(item.prop=='otherInstructions') item.disabled = true
        })
        this.getTaskDetails(record.id)
      }
      this.getTarget(record.id)
      this.getTaskQueryModel()
    },
    getTaskDetails(id) {
      getAnagement(id)
        .then((res) => {
          if (res.success) {
            const { result } = res
            this.$set(this.dispose, 'otherInstructions', result.otherInstructions)
          } else {
            this.$message.warn(res.message)
          }
        })
        .catch((e) => {
          this.$message.warn('操作失败！')
        })
    },
    getTarget(id) {
      getQuery(id)
        .then((res) => {
          if (res.success) {
            const { result } = res
            this.targetOptions = result.map((item) => {
              return {
                key: item.id.toString(),
                title: item.name + '（' + item.cellPhoneNumber + '）',
                id: item.id,
                name: item.name,
                phone: item.cellPhoneNumber,
              }
            })
            let name = this.targetOptions.map((v) => v.name)
            this.$set(this.dispose, 'name', name.toString())
            this.$set(this.taskVo, 'alarmPersons', this.targetOptions.map((v) => v.key))
            this.$set(this.taskVo, 'alarmPerson', this.targetOptions.map((v) => {
              return {
                id: v.id,
                name: v.name,
                phone: v.phone,
              }
            }))
          } else {
            this.$message.warn(res.message)
          }
        })
        .catch((e) => {
          this.$message.warn('操作失败！')
        })
    },
    getTaskQueryModel() {
      taskQueryModel()
        .then((res) => {
          if (res.success) {
            const { result } = res
            this.modelOptions = result.map((item) => {
              return {
                value: item.id.toString(),
                label: item.name,
                code: item.code,
              }
            })
          } else {
            this.$message.warn(res.message)
          }
        })
        .catch((e) => {
          this.$message.warn('操作失败！')
        })
    },
    handleOk() {
      const parameter = Object.assign(
        {},
        this.ynBool
          ? { yn: 1, id: this.model.id, dispose: this.dispose, taskVo: this.taskVo }
          : { yn: 0, id: this.model.id, dispose: this.dispose }
      )
      this.$refs.realForm.validate((valid) => {
        if (valid) {
          alarmCenterDisposal(parameter)
            .then((res) => {
              if (res.success) {
                this.$message.success(res.message?res.message:'操作成功')
                this.$emit('ok')
                this.handleCancel()
              } else {
                this.$message.warn(res.message?res.message:'操作失败')
              }
            })
            .catch((e) => {
              this.$message.warn('请求失败！')
            })
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    handleCancel() {
      this.visible = false
      this.dispose = {}
      this.taskVo = {}
      this.model = { dispose: {}, taskVo: {}, yn: 0 }
    },
    handleChange(value, datas) {
      let maps = datas.map((v) => v.data.props)
      this.$set(this.taskVo, 'alarmPerson', maps)
    },
    initDictOptions() {
      // 初始化模型配置项
      this.$initDictOptions('model_type').then((res) => {
        if (res.success) {
          let datas = res.result.map((item, index)=> {
            if (Number(item.value) <= 11) {
              return {
                text: item.label,
                value: item.value
              }
            }
          }).filter(obj => obj !== undefined)
          this.fieldArr1[0].dictOptions = [...datas]
        }
      })
    }
  }
}
</script>
<style lang="less" scoped></style>
